import React ,{useEffect}from 'react';
import styles from './login.less';
import { useDispatch, useSelector,useLocation,useHistory,IndexModelState} from 'umi'
import { Form, Input, Button, Checkbox } from 'antd';
import { UserOutlined, LockOutlined } from '@ant-design/icons';
let Login: React.FC = function () {


  const dispatch = useDispatch()
  const {isLogin}=useSelector((module:{login:IndexModelState})=>module.login)
  console.log(isLogin)
  const onFinish = (values: any) => {   //登录  修改状态
    dispatch({
      type:"login/login",
      payload:{
         user_name:values.username,
         user_pwd:values.password
      }
    })
  };
    //进入登录页判断是否进入没有进入的显示登录页 登录了跳转
    let {query:{redirect}}:any=useLocation()
    let  history=useHistory()
    let redirects=redirect?redirect:"/main"
    // console.log(redirects)
    useEffect(()=>{
         if(isLogin){   //代表登录成功了
          history.replace(redirects)
         }
    },[isLogin])
  return (
    <div className={styles.login}>
      <div className={styles.form}>
        <Form
          name="normal_login"
          className="login-form"
          initialValues={{ remember: true }}
          onFinish={onFinish}
        >
          <Form.Item
            name="username"
            rules={[{ required: true, message: '输入正确的用户名' }]}
          >
            <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="请输入用户名" />
          </Form.Item>
          <Form.Item
            name="password"
            rules={[{ required: true, message: '输入正确的密码' }]}
          >
            <Input
              prefix={<LockOutlined className="site-form-item-icon" />}
              type="password"
              placeholder="请输入密码"
            />
          </Form.Item>
          <Form.Item>
            <Form.Item name="remember" valuePropName="checked" noStyle>
              <Checkbox>记住密码</Checkbox>
            </Form.Item>

            <a className="login-form-forgot" href="">
              找回密码
        </a>
          </Form.Item>

          <Form.Item>
            <Button type="primary" htmlType="submit" className="login-form-button">
              登录
        </Button>
          </Form.Item>
        </Form>
      </div>
    </div>
  );
}
export default Login
